<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>欢迎管理员登录</title>
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/css/login.css">
    <script type="text/javascript" src="__PUBLIC__/js/jquery-3.2.0.min.js"></script>
</head>
<body>
<div class="header">
    <div class="header-login"><a href="{:U('Index/index')}">BackStage</a></div>
    <div class="header-nav">
        <a class="header-url" href="{:U('Admin/article')}">添加文章</a>
        <a class="header-url" href="{:U('Admin/myuser')}">用户管理</a>
        <a class="header-url" href="{:U('User/login')}">账号设置</a>
    </div>
</div>
<div class="main">
    <p class="main-head-a" style="background-color: transparent; color:#FFFFFF;margin-left: 100px ">后台管理</p>
    <div class="main-form">
        <p style="text-align: center">login</p>
            <label class="form-input">
                <span class="form-tag">username:</span>
                <input type="text" id="username">
               <!-- <span class="tip"><a href="{:U('User/register')}">注册账号</a></span>-->
            </label>
            <label class="form-input"><span class="warn1"></span></label>
            <label class="form-input">
                <span class="form-tag">password:</span>
                <input type="password" id="password">
               <!-- <span class="tip"><a href="" >忘记密码</a></span>-->
            </label>
            <label class="form-input"><span class="warn2"></span></label>
            <label class="form-input">
                <span class="form-tag"></span>
                <input type="button" id="button" value="立即登录">
            </label>
    </div>
</div>
<div class="footer"></div>
</body>
<script type="text/javascript">
$("#button").on('click',function(){
    var username=$("#username").val();
    var password=$("#password").val();
    var l1=username.length;
    var l2=password.length;
    if (l1== 0) {
        $(".warn1").css("color", "#FF0512");
        $(".warn1").text("✘请输入用户名！");
    } else {
        $("#username").attr("index", "1");
        var i=$("#username").attr("index");/*定义输入框状态属性*/
    }
    if (l2==0) {
        $(".warn2").css("color", "#FF0512");
        $(".warn2").text("✘请输入密码！");
    } else {
        $("#password").attr("index", "1");
        var j=$("#password").attr("index");/*定义输入框状态属性*/
    }

    /*若输入状态正常则发送数据到服务器验证*/
    if(i==1&&j==1){
        $.ajax({
            type: "POST",
            url: "{:U('Admin1/test')}",
            data: {username: username ,password: password},
            dataType: "text",
            success:function(re){
                if(re==1){
                    window.location.href="{:U('Admin/showarticle')}";/*登录成功跳转页面*/
                }else if(re==0){
                    alert("用户名或密码错误！");
                }
            }
        })
    }
})
</script>
</html>